<template>
	<view class="commentFrame">
		<uni-easyinput ref="uipt" suffixIcon="paperplane-filled" placeholderStyle="font-size: 15px"
			v-model="comment.comment_content" placeholder="开始评论吧!" @iconClick="sendComment"></uni-easyinput>
	</view>
</template>

<script setup>
	import {
		reactive
	} from "vue";
	import {
		getProvince
	} from '../../utils/tool.js'

	import {
		store
	} from '../../uni_modules/uni-id-pages/common/store.js'

	import pageJson from '@/pages.json'

	const db = uniCloud.database()
	const utilsObj = uniCloud.importObject('utilsobj', {
		customUI: true
	})

	const {
		article_id,
		reply_comment_item
	} = defineProps({
		article_id: String,
		reply_comment_item: Object
	})

	const emit = defineEmits(['addcomment'])

	const comment = reactive({
		article_id: article_id,
		comment_content: '',
		province: '',
	})

	const sendComment = async () => {
		if (!store.hasLogin) {
			uni.showModal({
				title: '请进行登录!!!',
				success: (res) => {
					if (res.confirm) {
						uni.navigateTo({
							url: "/" + pageJson.uniIdRouter.loginPage
						})
					}
				},
				fail: () => {
					uni.showToast({
						title: '取消登录',
						icon: 'none'
					})
					return;
				}
			})
		};
		if (!comment.comment_content) {
			uni.showToast({
				title: '评论内容不能为空',
				icon: 'none'
			})
			return;
		}
		comment.province = await getProvince()
		comment.reply_comment_id = reply_comment_item.item ? reply_comment_item.item._id : ''
		comment.reply_user_id = reply_comment_item.item ? uniCloud.getCurrentUserInfo().uid : ''
		comment.comment_type = reply_comment_item.item ? 1 : 0
		const res = await db.collection('blog-news-comments').add(comment)
		if (res.result.id) {
			uni.showToast({
				title: '评论成功!',
				icon: 'none'
			})
			await utilsObj.operation('blog', 'comment_count', `${article_id}`, 1)
			emit('addcomment', {
				...comment,
				comment_date: Date.now(),
				_id: res.result.id
			})
			comment.comment_content = ''
		}
	}
</script>

<style scoped lang="scss">
	.commentFrame {
		width: 100%;
		padding: 20rpx 30rpx;
		box-sizing: border-box;
		background-color: #fff;
		position: fixed;
		left: 0;
		bottom: 0rpx;
		z-index: 100;
	}
</style>